<template>
    <div>
        <el-card class="box-card">
                        <el-form ref="form" :model="form" :inline="true">

                        <el-form-item label="部门名称">
                                <el-input v-model.trim="form.name"></el-input>
                        </el-form-item>
                        <el-form-item label="父级ID">
                                <el-input v-model.trim="form.parentId"></el-input>
                        </el-form-item>
                        <el-form-item label="所有父级">
                                <el-input v-model.trim="form.parentArray"></el-input>
                        </el-form-item>
                        <el-form-item label="排序值">
                                <el-input v-model.trim="form.sort"></el-input>
                        </el-form-item>
                        <el-form-item label="备注">
                                <el-input v-model.trim="form.remarks"></el-input>
                        </el-form-item>
                        <el-form-item label="部门状态（1启用 2停用）">
                                <el-input v-model.trim="form.status"></el-input>
                        </el-form-item>
                        <el-form-item label="模块 1网格 2警务">
                                <el-input v-model.trim="form.model"></el-input>
                        </el-form-item>
                        <el-form-item label="删除标志（0正常 1删除）">
                                <el-input v-model.trim="form.isDelete"></el-input>
                        </el-form-item>
                        <el-form-item label="创建者">
                                <el-input v-model.trim="form.creatorId"></el-input>
                        </el-form-item>
                        <el-form-item label="创建时间">
                                <el-date-picker
                                        v-model.trim="form.createTime"
                                        type="date"
                                        placeholder="选择日期">
                                </el-date-picker>
                        </el-form-item>
                        <el-form-item label="更新者">
                                <el-input v-model.trim="form.updateId"></el-input>
                        </el-form-item>
                        <el-form-item label="更新时间">
                                <el-date-picker
                                        v-model.trim="form.updateTime"
                                        type="date"
                                        placeholder="选择日期">
                                </el-date-picker>
                        </el-form-item>
                <el-form-item>
                    <el-button type="primary" @click="handleCheck" icon="el-icon-search">查询</el-button>
                    <el-button type="info" @click="handleReset" icon="el-icon-refresh">重置</el-button>
                </el-form-item>
            </el-form>
            <div style="margin-bottom: 20px;">
                <el-button type="primary" @click="handleAdd('新增')" icon="el-icon-plus" size="mini">新增</el-button>
            </div>
            <el-table ref="multipleTable" :data="dataList" tooltip-effect="dark" border>
                    <el-table-column label="部门id" prop="id">
                    </el-table-column>
                    <el-table-column label="部门名称" prop="name">
                    </el-table-column>
                    <el-table-column label="父级ID" prop="parentId">
                    </el-table-column>
                    <el-table-column label="所有父级" prop="parentArray">
                    </el-table-column>
                    <el-table-column label="排序值" prop="sort">
                    </el-table-column>
                    <el-table-column label="备注" prop="remarks">
                    </el-table-column>
                    <el-table-column label="部门状态（1启用 2停用）" prop="status">
                    </el-table-column>
                    <el-table-column label="模块 1网格 2警务" prop="model">
                    </el-table-column>
                    <el-table-column label="删除标志（0正常 1删除）" prop="isDelete">
                    </el-table-column>
                    <el-table-column label="创建者" prop="creatorId">
                    </el-table-column>
                    <el-table-column label="创建时间" prop="createTime">
                    </el-table-column>
                    <el-table-column label="更新者" prop="updateId">
                    </el-table-column>
                    <el-table-column label="更新时间" prop="updateTime">
                    </el-table-column>
                <el-table-column label="操作" width="250px">
                    <template slot-scope="scope">
                        <el-tooltip class="item" effect="dark" content="编辑">
                            <el-button type="info" icon="el-icon-edit" size="mini"
                                       @click="handleEdit(scope.row,'编辑')"></el-button>
                        </el-tooltip>
                        <el-tooltip class="item" effect="dark" content="删除">
                            <el-button type="info" icon="el-icon-delete" size="mini"
                                       @click="handleDelete(scope.row.id)"></el-button>
                        </el-tooltip>
                    </template>
                </el-table-column>
            </el-table>
            <el-pagination layout="prev, pager, next" :total="total" :page-size.sync="size" :current-page.sync="current"
                           @current-change='handleChange'>
            </el-pagination>
            <deptSave ref="modalForm" @ok="medelok">
            </deptSave>
        </el-card>
    </div>
</template>

<script>
    //{
    //path: "/deptTable",
    //name: "/deptTable",
    //component: () =>
    //import("@/views/pages/dept/DeptTable")
    //},
    import {getAction} from "@/api/manage"
    import {publicdata} from "@/minxins/public"

    import deptSave from "./components/DeptSave"

    export default {
        name: "deptTable",
        mixins: [publicdata],
        data() {
            return {
                dataList: [],
                total: 0,
                size: 12,
                current: 1,
                url: {
                    delete: "/dept/deleteById",
                    list: "/dept/pageList"
                },
                form: {
            id:
            '',
            name:
            '',
            parentId:
            '',
            parentArray:
            '',
            sort:
            '',
            remarks:
            '',
            status:
            '',
            model:
            '',
            isDelete:
            '',
            creatorId:
            '',
            createTime:
            '',
            updateId:
            '',
            updateTime:
            ''        }
        }
        },
        components: {
            deptSave
        },
        mounted() {
            this.loadData()
        },
        methods: {
            // 获取表格数据
            loadData() {
                const params = {
                    'current': this.current,
                    'size': this.size,
                id:
                this.form.id,
                name:
                this.form.name,
                parentId:
                this.form.parentId,
                parentArray:
                this.form.parentArray,
                sort:
                this.form.sort,
                remarks:
                this.form.remarks,
                status:
                this.form.status,
                model:
                this.form.model,
                isDelete:
                this.form.isDelete,
                creatorId:
                this.form.creatorId,
                createTime:
                this.form.createTime,
                updateId:
                this.form.updateId,
                updateTime:
                this.form.updateTime            }
                getAction(this.$api.baseurl + this.url.list, params).then(res => {
                    if (res.data.code == 200) {
                        this.dataList = res.data.data.records
                        this.total = res.data.data.total
                    } else {
                        this.$message.info(res.data.msg)
                    }

                }).catch(err => {

                })

            },
        }
    }
</script>

<style scoped>

</style>
